import React, { Component } from 'react'
import { Route, NavLink, Switch, Redirect } from 'react-router-dom'

import Message from './Message'
import News from './News'
export default class Home extends Component {
  render() {
    return (
      <div className="col-xs-7 col-xs-offset-1">
        <h2>Home</h2>
        <hr></hr>
        <ul className="nav nav-tabs">
          <li>
            <NavLink to="/home/news" className="list-group-active">News</NavLink>
          </li>
          <li>
            <NavLink to="/home/message" className="list-group-active">Message</NavLink>
          </li>
        </ul>
        <Switch>
          <Route path="/home/news" component={News}></Route>
          <Route path="/home/message" component={Message}></Route>
          <Redirect to="/home/news"></Redirect>
        </Switch>
      </div>
    )
  }
}
